<template>
  <a-modal v-model:open="open" title="平台SKU特殊服务列表" @ok="handleOk" width="800px" :maskClosable="false">
    <a-button type="primary" @click="addForm = true">创建添加物流服务工单</a-button>
    <common-table :dataSource="data" style="max-height:500px;overflow-y: auto" :columns="columns" :loading="loading" :pagination="false" />
    <add-form :form-item="formItem" :rules="rules" :add-form="addForm" :ref="addFormRef" @submit="submit" @close="close"/>
  </a-modal>
</template>
<script setup>
import {message} from "ant-design-vue";
import {useRouter} from "vue-router";
import {createTicket, getListProductSku} from "@/api/standard/index.js";
import AddForm from "@/views/upload/components/addForm.vue"
const handleOk = () => {
  open.value = false
}
const open = ref(false)
const loading = ref(false)
const data = ref([])
const router = useRouter()
const props = defineProps({
  orderId: {
    type: String,
    required: true
  },
  platform: {
    type: String,
    required: true
  }
})
const columns = [
  {
    title: '平台SKU',
    dataIndex: 'productSku',
    width: 300,
    align: 'center'
  },
  {
    title: '特殊服务',
    dataIndex:'specialService',
    width: 300,
    align: 'center'
  }
]
const formItem = ref([
  {
    label: '订单号',
    value: 'orderId',
    type: 'text',
    defaultValue: props.orderId,
  },
  {
    label: '平台',
    value: 'platform',
    type: 'text',
    defaultValue: props.platform,
  },
  {
    label: '平台SKU列表',
    value: 'productSkus',
    type: 'multiselect',
    options:[]
  },
  {
    label: '服务等级',
    value: 'specialService',
    type: 'select',
    options: [
      {
        label:'ASSY',
        value:'ASSY'
      },
      {
        label:'WGD',
        value:'WGD'
      },
      {
        label:'ROC',
        value:'ROC'
      },
      {
        label:'IDD',
        value:'IDD'
      },
      {
        label:'OD(CA)',
        value:'OD'
      }
    ]
  },
  {
    label: '原因类型',
    value: 'reasonType',
    type: 'select',
    options: [
      {
        label:'购买',
        value:'购买'
      },
      {
        label:'赠送',
        value:'赠送'
      },
      {
        label:'更换SKU',
        value:'更换SKU'
      }
    ]
  },
  {
    label: '备注',
    value: 'remark',
    type: 'textarea',
  },
])
const submit = async (form) => {
  try{
    for (let formKey in form) {
      if(form[formKey] === undefined || form[formKey] === null || form[formKey] === '' || form[formKey] == []){
        delete form[formKey]
      }
    }
   const res = await createTicket({
     ...form,
      // orderId: props.orderId,
      // platform: props.platform,
      productSkus: form.productSkus.join(',')
   })
    message.success(`${res.message}工单创建成功`)
    addForm.value = false
    window.open(import.meta.env.VITE_JUICE + `pages/customerService/AllticketDetail?ticketId=${res.message}`,'_blank')
  }catch (e){
    message.error(e)
  }
}
const close = () => {
  addForm.value = false
}
const rules = {
  productSkus:[
    {
      required: true,
      message: '平台SKU列表不能为空',
      trigger: 'blur'
    }
  ],
  specialService:[
    {
      required: true,
      message: '服务等级不能为空',
      trigger: 'blur'
    }
  ],
  reasonType:[
    {
      required: true,
      message: '原因类型不能为空',
      trigger: 'blur'
    }
  ],
}
const addFormRef = ref(null)
const addForm = ref(false)
const init = async () => {
  try{
    open.value = true
    loading.value = true
    const res = await getListProductSku({orderId:props.orderId})
    loading.value = false
    data.value = res.result
    formItem.value[2].options = data.value.map(item => {
      return {
        value: item.productSku
      }
    })
  }catch (e){
    message.error(e.message)
  }finally{
    loading.value = false
  }
}
defineExpose({
  init
})
</script>
<style scoped>

</style>
